{% extends 'base/front_base.html' %}
{% load my_filter %}

{% block title %}
    搜索
{% endblock %}

{% block head %}
    <link rel="stylesheet" href="{% static 'css/search/search.min.css' %}">
{% endblock %}

{% block main %}
    <div class="main">
        <div class="wrapper">
            <div class="main-content-wrapper">
                <div class="search-area">
                    <form action="" method="get">
                        <input type="text" name="q" class="search-input" placeholder="可输入新闻关键词、作者名字搜索" value="{{ query }}">
                        <input type="submit" class="search-btn" value="搜索">
                    </form>
                </div>
                <div class="recommend-list">
                    {% if query %}
                        <h2>搜索结果</h2>
                        <ul class="list-inner-group">
                            {% if not page.object_list %}
                                <li>抱歉，未查询到与"{{ query }}"相关的结果</li>
                            {% endif %}
                            {% for result in page.object_list %}
                                {% with result.object as news %}
                                    <li>
                                        <div class="thumbnail-group">
                                            <a href="{% url 'news:news_detail' news_id=news.pk %}"><img src="{{ news.thumbnail }}" alt=""></a>
                                        </div>
                                        <div class="news-group">
                                            <p class="title"><a href="{% url 'news:news_detail' news_id=news.pk %}">{{ news.title }}</a></p>
                                            <p class="desc">{{ news.desc }}</p>
                                            <p class="more">
                                                <span class="category">{{ news.category.name }}</span>
                                                <span class="pub-time">{{ news.pub_time|time_since }}</span>
                                                <span class="author">{{ news.author.username }}</span>
                                            </p>
                                        </div>
                                    </li>
                                {% endwith %}
                            {% endfor %}
                        </ul>
                    {% endif %}
                </div>
                <div class="recommend-list">
                    <h2>热门推荐</h2>
                    <ul class="list-inner-group">
                        <li>
                            <div class="thumbnail-group">
                                <a href="/"><img src="http://static-image.xfz.cn/1516169692_914.jpg-website.news.list" alt=""></a>
                            </div>
                            <div class="news-group">
                                <p class="title"><a href="/">王健林卖掉进军海外首个项目:17亿售伦敦ONE六成股权</a></p>
                                <p class="desc">外界关于万达要出售此前在海外投资项目的消息一直不断。</p>
                                <p class="more">
                                    <span class="category">深度报道</span>
                                    <span class="pub-time">1小时前</span>
                                    <span class="author">知了课堂</span>
                                </p>
                            </div>
                        </li>
                        <li>
                            <div class="thumbnail-group">
                                <a href="/"><img src="http://static-image.xfz.cn/1516010894_546.jpg-website.news.list" alt=""></a>
                            </div>
                            <div class="news-group">
                                <p class="title"><a href="/">张小龙演讲全文：小程序、公众号将会有哪些变化？</a></p>
                                <p class="desc">我认为探索线下的精彩生活，这是我们下一步想要尝试的一个方向。</p>
                                <p class="more">
                                    <span class="category">热点</span>
                                    <span class="pub-time">2小时前</span>
                                    <span class="author">知了课堂</span>
                                </p>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            {% include 'common/sidebar.html' %}
        </div>
    </div>
{% endblock %}